<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="/common/include/page.jsp"%>
<!DOCTYPE html>
<html lang="en">
	<head>
		<title>${requestScope.goods.name } - 商城</title>
		<%@ include file="/common/include/title.jsp"%>
		<script type="text/javascript">
			/* 添加购物车 */
			function addCar()
			{
				var num = $("#num").val();
				//alert("=====");
				/*
					参数1:url
					参数2:上行参数;字符串,也可以是json
					参数3:下行参数;取决于服务器端
				*/
				$.post(
					"${rootPath}/carInsert.html",
					/* json的键就是url参数中的键,json的值就是url参数中的值 */
					/* {goodsId:goodsId,num:"1"}, */
					"goodsId=" + ${requestScope.goods.id} + "&num=" + num,
					function(data)
					{
						/* data:方法的参数,名字随便起,含义是回信的内容 */
						alert(data.code + "===回信内容:" + data.info);
					},
					/* 所有回信全部是字符串,jquery会把字符串变成json对象 */
					"json"
				);
				return false ; 
			}
		</script>
	</head>
	<body>
		<%-- <%@ include file="/common/include/header.jsp"%> --%>
		<%-- 如果包含的页面中数据是活的,需要访问Contrller查询数据库只能使用动态包含 --%>
		<!-- 动态包含可以带参数?相当于?后面的内容
				header.html?cateIdTemp=${requestScope.cateId}
			 -->
		<jsp:include page="/header.html">
			<jsp:param value="${requestScope.cateId}" name="cateIdTemp"/>
		</jsp:include>
		<div id="mainBody">
			<div class="container">
				<div class="row">
					<!-- Sidebar ================================================== -->
					<div id="sidebar" class="span3">
						<div class="well well-small">
							<a id="myCart" href="product_summary.html"><img
								src="themes/images/ico-cart.png" alt="cart">3 Items in your
								cart <span class="badge badge-warning pull-right">$155.00</span></a>
						</div>
						<ul id="sideManu" class="nav nav-tabs nav-stacked">
							<li class="subMenu open"><a> ELECTRONICS [230]</a>
								<ul>
									<li><a class="active" href="products.html"><i
											class="icon-chevron-right"></i>Cameras (100) </a></li>
									<li><a href="products.html"><i
											class="icon-chevron-right"></i>Computers, Tablets & laptop
											(30)</a></li>
									<li><a href="products.html"><i
											class="icon-chevron-right"></i>Mobile Phone (80)</a></li>
									<li><a href="products.html"><i
											class="icon-chevron-right"></i>Sound & Vision (15)</a></li>
								</ul></li>
							<li class="subMenu"><a> CLOTHES [840] </a>
								<ul style="display: none">
									<li><a href="products.html"><i
											class="icon-chevron-right"></i>Women's Clothing (45)</a></li>
									<li><a href="products.html"><i
											class="icon-chevron-right"></i>Women's Shoes (8)</a></li>
									<li><a href="products.html"><i
											class="icon-chevron-right"></i>Women's Hand Bags (5)</a></li>
									<li><a href="products.html"><i
											class="icon-chevron-right"></i>Men's Clothings (45)</a></li>
									<li><a href="products.html"><i
											class="icon-chevron-right"></i>Men's Shoes (6)</a></li>
									<li><a href="products.html"><i
											class="icon-chevron-right"></i>Kids Clothing (5)</a></li>
									<li><a href="products.html"><i
											class="icon-chevron-right"></i>Kids Shoes (3)</a></li>
								</ul></li>
							<li class="subMenu"><a>FOOD AND BEVERAGES [1000]</a>
								<ul style="display: none">
									<li><a href="products.html"><i
											class="icon-chevron-right"></i>Angoves (35)</a></li>
									<li><a href="products.html"><i
											class="icon-chevron-right"></i>Bouchard Aine & Fils (8)</a></li>
									<li><a href="products.html"><i
											class="icon-chevron-right"></i>French Rabbit (5)</a></li>
									<li><a href="products.html"><i
											class="icon-chevron-right"></i>Louis Bernard (45)</a></li>
									<li><a href="products.html"><i
											class="icon-chevron-right"></i>BIB Wine (Bag in Box) (8)</a></li>
									<li><a href="products.html"><i
											class="icon-chevron-right"></i>Other Liquors & Wine (5)</a></li>
									<li><a href="products.html"><i
											class="icon-chevron-right"></i>Garden (3)</a></li>
									<li><a href="products.html"><i
											class="icon-chevron-right"></i>Khao Shong (11)</a></li>
								</ul></li>
							<li><a href="products.html">HEALTH & BEAUTY [18]</a></li>
							<li><a href="products.html">SPORTS & LEISURE [58]</a></li>
							<li><a href="products.html">BOOKS & ENTERTAINMENTS [14]</a></li>
						</ul>
						<br />
						<div class="thumbnail">
							<img src="themes/images/products/panasonic.jpg"
								alt="Bootshop panasonoc New camera" />
							<div class="caption">
								<h5>Panasonic</h5>
								<h4 style="text-align: center">
									<a class="btn" href="product_details.html"> <i
										class="icon-zoom-in"></i></a> <a class="btn" href="#">Add to <i
										class="icon-shopping-cart"></i></a> <a class="btn btn-primary"
										href="#">$222.00</a>
								</h4>
							</div>
						</div>
						<br />
						<div class="thumbnail">
							<img src="themes/images/products/kindle.png"
								title="Bootshop New Kindel" alt="Bootshop Kindel">
							<div class="caption">
								<h5>Kindle</h5>
								<h4 style="text-align: center">
									<a class="btn" href="product_details.html"> <i
										class="icon-zoom-in"></i></a> <a class="btn" href="#">Add to <i
										class="icon-shopping-cart"></i></a> <a class="btn btn-primary"
										href="#">$222.00</a>
								</h4>
							</div>
						</div>
						<br />
						<div class="thumbnail">
							<img src="themes/images/payment_methods.png"
								title="Bootshop Payment Methods" alt="Payments Methods">
							<div class="caption">
								<h5>Payment Methods</h5>
							</div>
						</div>
					</div>
					<!-- Sidebar end=============================================== -->
					<div class="span9">
						<ul class="breadcrumb">
							<li><a href="${rootPath }/main.html">首页</a><span class="divider">/</span></li>
							<li>
								<a href="${rootPath }/goods_${requestScope.goods.cateId}_1.html">${requestScope.goods.goodsCate.name }</a>
								<span class="divider">/</span>
							</li>
							<li class="active">${requestScope.goods.name }</li>
						</ul>
						<div class="row">
							<div id="gallery" class="span3">
								<a href="${rootPath }/themes/images/products/large/f1.jpg"
									title="${requestScope.goods.name }">
									<img src="${rootPath }/themes/images/products/large/3.jpg" style="width: 100%" alt="${requestScope.goods.name }" />
								</a>
								<div id="differentview" class="moreOptopm carousel slide">
									<div class="carousel-inner">
										<div class="item active">
											<a href="${rootPath }/themes/images/products/large/f1.jpg">
												<img style="width: 29%" src="${rootPath }/themes/images/products/large/f1.jpg" alt="" />
											</a>
											<a href="${rootPath }/themes/images/products/large/f2.jpg">
												<img style="width: 29%" src="${rootPath }/themes/images/products/large/f2.jpg" alt="" />
											</a>
											<a href="${rootPath }/themes/images/products/large/f3.jpg">
												<img style="width: 29%" src="${rootPath }/themes/images/products/large/f3.jpg" alt="" />
											</a>
										</div>
										<div class="item">
											<a href="${rootPath }/themes/images/products/large/f3.jpg">
												<img style="width: 29%" src="${rootPath }/themes/images/products/large/f3.jpg" alt="" />
											</a>
											<a href="${rootPath }/themes/images/products/large/f1.jpg">
												<img style="width: 29%" src="${rootPath }/themes/images/products/large/f1.jpg" alt="" />
											</a>
											<a href="${rootPath }/themes/images/products/large/f2.jpg">
												<img style="width: 29%" src="${rootPath }/themes/images/products/large/f2.jpg" alt="" />
											</a>
										</div>
									</div>
									<!--  
				  <a class="left carousel-control" href="#myCarousel" data-slide="prev">‹</a>
	              <a class="right carousel-control" href="#myCarousel" data-slide="next">›</a> 
				  -->
								</div>
	
								<div class="btn-toolbar">
									<div class="btn-group">
										<span class="btn"><i class="icon-envelope"></i></span> <span
											class="btn"><i class="icon-print"></i></span> <span
											class="btn"><i class="icon-zoom-in"></i></span> <span
											class="btn"><i class="icon-star"></i></span> <span
											class="btn"><i class=" icon-thumbs-up"></i></span> <span
											class="btn"><i class="icon-thumbs-down"></i></span>
									</div>
								</div>
							</div>
							<div class="span6">
								<h3>${requestScope.goods.name }</h3>
								<!-- <small>- (14MP, 18x Optical Zoom) 3-inch LCD</small> -->
								<hr class="soft" />
								<form class="form-horizontal qtyFrm">
									<div class="control-group">
										<label class="control-label">
											<span><del>Y${requestScope.goods.marketPrice }</del> -- Y${requestScope.goods.price }</span>
										</label>
										<div class="controls">
											<input type="number" class="span1" id="num" placeholder="Qty." value="1"/>
											<button type="submit" onclick="return addCar()"
												class="btn btn-large btn-primary pull-right">
												添加购物车
												<i class=" icon-shopping-cart"></i>
											</button>
										</div>
									</div>
								</form>
								<hr class="soft" />
								<!-- <h4>100 items in stock</h4>
								<form class="form-horizontal qtyFrm pull-right">
									<div class="control-group">
										<label class="control-label"><span>Color</span></label>
										<div class="controls">
											<select class="span2">
												<option>Black</option>
												<option>Red</option>
												<option>Blue</option>
												<option>Brown</option>
											</select>
										</div>
									</div>
								</form> -->
								<hr class="soft clr" />
								<p>14 Megapixels. 18.0 x Optical Zoom. 3.0-inch LCD Screen.
									Full HD photos and 1280 x 720p HD movie capture. ISO sensitivity
									ISO6400 at reduced resolution. Tracking Auto Focus. Motion
									Panorama Mode. Face Detection technology with Blink detection
									and Smile and shoot mode. 4 x AA batteries not included. WxDxH
									110.2 ×81.4x73.4mm. Weight 0.341kg (excluding battery and memory
									card). Weight 0.437kg (including battery and memory card).</p>
								<a class="btn btn-small pull-right" href="#detail">更多详情</a> 
								<br class="clr" />
								<a href="#" name="detail"></a>
								<hr class="soft" />
							</div>
	
							<div class="span9">
								<ul id="productDetail" class="nav nav-tabs">
									<li class="active">
										<a href="#home" data-toggle="tab">详情介绍</a>
									</li>
									<li>
										<a href="#profile" data-toggle="tab">相关产品</a>
									</li>
								</ul>
								<div id="myTabContent" class="tab-content">
									<div class="tab-pane fade active in" id="home">
										<!-- 百度编辑器里面的代码 -->
										${requestScope.goods.content }
									</div>
									<div class="tab-pane fade" id="profile">
										<div id="myTab" class="pull-right">
											<a href="#listView" data-toggle="tab"><span
												class="btn btn-large"><i class="icon-list"></i></span></a> <a
												href="#blockView" data-toggle="tab"><span
												class="btn btn-large btn-primary"><i
													class="icon-th-large"></i></span></a>
										</div>
										<br class="clr" />
										<hr class="soft" />
										<div class="tab-content">
											<div class="tab-pane" id="listView">
												<div class="row">
													<div class="span2">
														<img src="themes/images/products/4.jpg" alt="" />
													</div>
													<div class="span4">
														<h3>New | Available</h3>
														<hr class="soft" />
														<h5>Product Name</h5>
														<p>Nowadays the lingerie industry is one of the most
															successful business spheres.We always stay in touch with
															the latest fashion tendencies - that is why our goods are
															so popular..</p>
														<a class="btn btn-small pull-right"
															href="product_details.html">View Details</a> <br
															class="clr" />
													</div>
													<div class="span3 alignR">
														<form class="form-horizontal qtyFrm">
															<h3>$222.00</h3>
															<label class="checkbox"> <input type="checkbox">
																Adds product to compair
															</label><br />
															<div class="btn-group">
																<a href="product_details.html"
																	class="btn btn-large btn-primary"> Add to <i
																	class=" icon-shopping-cart"></i></a> <a
																	href="product_details.html" class="btn btn-large"><i
																	class="icon-zoom-in"></i></a>
															</div>
														</form>
													</div>
												</div>
												<hr class="soft" />
												<div class="row">
													<div class="span2">
														<img src="themes/images/products/5.jpg" alt="" />
													</div>
													<div class="span4">
														<h3>New | Available</h3>
														<hr class="soft" />
														<h5>Product Name</h5>
														<p>Nowadays the lingerie industry is one of the most
															successful business spheres.We always stay in touch with
															the latest fashion tendencies - that is why our goods are
															so popular..</p>
														<a class="btn btn-small pull-right"
															href="product_details.html">View Details</a> <br
															class="clr" />
													</div>
													<div class="span3 alignR">
														<form class="form-horizontal qtyFrm">
															<h3>$222.00</h3>
															<label class="checkbox"> <input type="checkbox">
																Adds product to compair
															</label><br />
															<div class="btn-group">
																<a href="product_details.html"
																	class="btn btn-large btn-primary"> Add to <i
																	class=" icon-shopping-cart"></i></a> <a
																	href="product_details.html" class="btn btn-large"><i
																	class="icon-zoom-in"></i></a>
															</div>
														</form>
													</div>
												</div>
												<hr class="soft" />
												<div class="row">
													<div class="span2">
														<img src="themes/images/products/6.jpg" alt="" />
													</div>
													<div class="span4">
														<h3>New | Available</h3>
														<hr class="soft" />
														<h5>Product Name</h5>
														<p>Nowadays the lingerie industry is one of the most
															successful business spheres.We always stay in touch with
															the latest fashion tendencies - that is why our goods are
															so popular..</p>
														<a class="btn btn-small pull-right"
															href="product_details.html">View Details</a> <br
															class="clr" />
													</div>
													<div class="span3 alignR">
														<form class="form-horizontal qtyFrm">
															<h3>$222.00</h3>
															<label class="checkbox"> <input type="checkbox">
																Adds product to compair
															</label><br />
															<div class="btn-group">
																<a href="product_details.html"
																	class="btn btn-large btn-primary"> Add to <i
																	class=" icon-shopping-cart"></i></a> <a
																	href="product_details.html" class="btn btn-large"><i
																	class="icon-zoom-in"></i></a>
															</div>
														</form>
													</div>
												</div>
												<hr class="soft" />
												<div class="row">
													<div class="span2">
														<img src="themes/images/products/7.jpg" alt="" />
													</div>
													<div class="span4">
														<h3>New | Available</h3>
														<hr class="soft" />
														<h5>Product Name</h5>
														<p>Nowadays the lingerie industry is one of the most
															successful business spheres.We always stay in touch with
															the latest fashion tendencies - that is why our goods are
															so popular..</p>
														<a class="btn btn-small pull-right"
															href="product_details.html">View Details</a> <br
															class="clr" />
													</div>
													<div class="span3 alignR">
														<form class="form-horizontal qtyFrm">
															<h3>$222.00</h3>
															<label class="checkbox"> <input type="checkbox">
																Adds product to compair
															</label><br />
															<div class="btn-group">
																<a href="product_details.html"
																	class="btn btn-large btn-primary"> Add to <i
																	class=" icon-shopping-cart"></i></a> <a
																	href="product_details.html" class="btn btn-large"><i
																	class="icon-zoom-in"></i></a>
															</div>
														</form>
													</div>
												</div>
	
												<hr class="soft" />
												<div class="row">
													<div class="span2">
														<img src="themes/images/products/8.jpg" alt="" />
													</div>
													<div class="span4">
														<h3>New | Available</h3>
														<hr class="soft" />
														<h5>Product Name</h5>
														<p>Nowadays the lingerie industry is one of the most
															successful business spheres.We always stay in touch with
															the latest fashion tendencies - that is why our goods are
															so popular..</p>
														<a class="btn btn-small pull-right"
															href="product_details.html">View Details</a> <br
															class="clr" />
													</div>
													<div class="span3 alignR">
														<form class="form-horizontal qtyFrm">
															<h3>$222.00</h3>
															<label class="checkbox"> <input type="checkbox">
																Adds product to compair
															</label><br />
															<div class="btn-group">
																<a href="product_details.html"
																	class="btn btn-large btn-primary"> Add to <i
																	class=" icon-shopping-cart"></i></a> <a
																	href="product_details.html" class="btn btn-large"><i
																	class="icon-zoom-in"></i></a>
															</div>
														</form>
													</div>
												</div>
												<hr class="soft" />
												<div class="row">
													<div class="span2">
														<img src="themes/images/products/9.jpg" alt="" />
													</div>
													<div class="span4">
														<h3>New | Available</h3>
														<hr class="soft" />
														<h5>Product Name</h5>
														<p>Nowadays the lingerie industry is one of the most
															successful business spheres.We always stay in touch with
															the latest fashion tendencies - that is why our goods are
															so popular..</p>
														<a class="btn btn-small pull-right"
															href="product_details.html">View Details</a> <br
															class="clr" />
													</div>
													<div class="span3 alignR">
														<form class="form-horizontal qtyFrm">
															<h3>$222.00</h3>
															<label class="checkbox"> <input type="checkbox">
																Adds product to compair
															</label><br />
															<div class="btn-group">
																<a href="product_details.html"
																	class="btn btn-large btn-primary"> Add to <i
																	class=" icon-shopping-cart"></i></a> <a
																	href="product_details.html" class="btn btn-large"><i
																	class="icon-zoom-in"></i></a>
															</div>
														</form>
													</div>
												</div>
												<hr class="soft" />
											</div>
											<div class="tab-pane active" id="blockView">
												<ul class="thumbnails">
													<li class="span3">
														<div class="thumbnail">
															<a href="product_details.html"><img
																src="themes/images/products/10.jpg" alt="" /></a>
															<div class="caption">
																<h5>Manicure &amp; Pedicure</h5>
																<p>Lorem Ipsum is simply dummy text.</p>
																<h4 style="text-align: center">
																	<a class="btn" href="product_details.html"> <i
																		class="icon-zoom-in"></i></a> <a class="btn" href="#">Add
																		to <i class="icon-shopping-cart"></i>
																	</a> <a class="btn btn-primary" href="#">&euro;222.00</a>
																</h4>
															</div>
														</div>
													</li>
													<li class="span3">
														<div class="thumbnail">
															<a href="product_details.html"><img
																src="themes/images/products/11.jpg" alt="" /></a>
															<div class="caption">
																<h5>Manicure &amp; Pedicure</h5>
																<p>Lorem Ipsum is simply dummy text.</p>
																<h4 style="text-align: center">
																	<a class="btn" href="product_details.html"> <i
																		class="icon-zoom-in"></i></a> <a class="btn" href="#">Add
																		to <i class="icon-shopping-cart"></i>
																	</a> <a class="btn btn-primary" href="#">&euro;222.00</a>
																</h4>
															</div>
														</div>
													</li>
													<li class="span3">
														<div class="thumbnail">
															<a href="product_details.html"><img
																src="themes/images/products/12.jpg" alt="" /></a>
															<div class="caption">
																<h5>Manicure &amp; Pedicure</h5>
																<p>Lorem Ipsum is simply dummy text.</p>
																<h4 style="text-align: center">
																	<a class="btn" href="product_details.html"> <i
																		class="icon-zoom-in"></i></a> <a class="btn" href="#">Add
																		to <i class="icon-shopping-cart"></i>
																	</a> <a class="btn btn-primary" href="#">&euro;222.00</a>
																</h4>
															</div>
														</div>
													</li>
													<li class="span3">
														<div class="thumbnail">
															<a href="product_details.html"><img
																src="themes/images/products/13.jpg" alt="" /></a>
															<div class="caption">
																<h5>Manicure &amp; Pedicure</h5>
																<p>Lorem Ipsum is simply dummy text.</p>
																<h4 style="text-align: center">
																	<a class="btn" href="product_details.html"> <i
																		class="icon-zoom-in"></i></a> <a class="btn" href="#">Add
																		to <i class="icon-shopping-cart"></i>
																	</a> <a class="btn btn-primary" href="#">&euro;222.00</a>
																</h4>
															</div>
														</div>
													</li>
													<li class="span3">
														<div class="thumbnail">
															<a href="product_details.html"><img
																src="themes/images/products/1.jpg" alt="" /></a>
															<div class="caption">
																<h5>Manicure &amp; Pedicure</h5>
																<p>Lorem Ipsum is simply dummy text.</p>
																<h4 style="text-align: center">
																	<a class="btn" href="product_details.html"> <i
																		class="icon-zoom-in"></i></a> <a class="btn" href="#">Add
																		to <i class="icon-shopping-cart"></i>
																	</a> <a class="btn btn-primary" href="#">&euro;222.00</a>
																</h4>
															</div>
														</div>
													</li>
													<li class="span3">
														<div class="thumbnail">
															<a href="product_details.html"><img
																src="themes/images/products/2.jpg" alt="" /></a>
															<div class="caption">
																<h5>Manicure &amp; Pedicure</h5>
																<p>Lorem Ipsum is simply dummy text.</p>
																<h4 style="text-align: center">
																	<a class="btn" href="product_details.html"> <i
																		class="icon-zoom-in"></i></a> <a class="btn" href="#">Add
																		to <i class="icon-shopping-cart"></i>
																	</a> <a class="btn btn-primary" href="#">&euro;222.00</a>
																</h4>
															</div>
														</div>
													</li>
												</ul>
												<hr class="soft" />
											</div>
										</div>
										<br class="clr">
									</div>
								</div>
							</div>
	
						</div>
					</div>
				</div>
			</div>
		</div>
		<%@ include file="/common/include/footer.jsp"%>
	</body>
</html>